<script setup>
import LogoImage from '@/assets/images/logo.png';
</script>

<template>
  <div class="container">
    <div class="header">
      <van-image :src="LogoImage" width="50px" height="50px" />
      <van-image src="https://img.yzcdn.cn/vant/logo.png" width="50px" height="50px" />
    </div>
    <h1 class="title">ViteJS + Vue3 + Vant4</h1>
    <van-cell-group title="模块" inset>
      <van-cell title="跳转 Pinia 示例页" is-link to="/pinia" />
      <van-cell title="跳转 Pinia 示例页" is-link to="/pinia" />
      <van-cell title="跳转 Pinia 示例页" is-link to="/pinia" />
      <van-cell title="跳转 Pinia 示例页" is-link to="/pinia" />
    </van-cell-group>
  </div>
</template>

<style lang="scss" scoped>
.container {
  min-height: 100vh;
  background-color: #f7f7f7;
  padding: 20px;
  box-sizing: border-box;
  .header {
    display: flex;
  }
  .title {
    font-size: 30px;
    margin-top: 20px;
  }
  :deep(.van-cell-group__title) {
    margin-top: 20px;
  }
}
</style>
